// mapMine
var mapMine = {
  mapWidth: 9,        // 雷场宽度
  mapHeight: 9,       // 雷场高度
  mapMine: 10,        // 雷数
  mapFlag: 10,        // 剩余旗子数
  map: []             // 雷场
  // 0 无暗  1 有暗  2 无旗  3 有旗 4 无明
}

// 获取元素
var wrapper = document.getElementsByClassName('wrapper')[0];    // 外部容器
var mineField = document.getElementsByClassName('mineField')[0];  // 雷场地图
var numFlag = document.getElementsByClassName('numFlag')[0];    // 余旗
var btnGame = document.getElementsByClassName('btnGame')[0];    // 笑脸
var numTime = document.getElementsByClassName('numTime')[0];    // 时间
var simple = document.getElementsByClassName('simple')[0];
var normal = document.getElementsByClassName('normal')[0];
var difficult = document.getElementsByClassName('difficult')[0];
var timer = 0;    // 时间
var firstClick = true;   // 是否为首次点击
var state = true;        // 游戏状态
var degree = 'simple';   // 难度
// ['simple', 'normal', 'difficult', 'custom'],
var numColor = ['#000', '#0f0', '#0a0', '#00f', '#00a', '#f00', '#a00', '#a00', '#a00'];
var div = mineField.getElementsByTagName('div');


// 点击检测
// 事件委派给mineField
mineField.onmousedown = function (event) {
  if(state == false){
    return ;
  }
  event = event || window.event;
  var target = event.target || window.target;
  // 获取点击坐标
  var coord = obtainCoord(target);
  // 首次点击
  if (firstClick == true) {
    firstClick = false;
    timer = setInterval(() => {
      numTime.innerHTML = (+numTime.innerHTML) + 1;
    }, 1000);
    // 首次点击不会踩雷
    if (mapMine.map[coord.x][coord.y] == 1) {
      createMine();
      mapMine.map[coord.x][coord.y] = 0;
    }
  }
  // 处理点击
  if (event.button == 0) {
    if (mapMine.map[coord.x][coord.y] == 0 || mapMine.map[coord.x][coord.y] == 4) {
      mapMine.map[coord.x][coord.y] = 4;
      target.style.backgroundColor = '#fff';
      var check = checkClick(coord);
      if (check == 0) {
        // 扩散检索(未完成)
        spreadBfs(coord);
      } else {
        target.innerHTML = check;
        target.style.color = numColor[check];
        mapMine.map[coord.x][coord.y] = 2;
      }
    } else if (mapMine.map[coord.x][coord.y] == 1) {
      // 游戏结束
      gameOver();
    }
  } else if (event.button == 2) {
    if(mapMine.mapFlag > 0 && mapMine.map[coord.x][coord.y] < 2 && target.localName != 'i'){
      mapMine.mapFlag--;
      mapMine.map[coord.x][coord.y] += 2;
      target.innerHTML = addIcon('qizi');
      numFlag.innerHTML = mapMine.mapFlag;
    }else if(mapMine.mapFlag < mapMine.mapMine && mapMine.map[coord.x][coord.y] >= 2 && mapMine.map[coord.x][coord.y] < 4){
      mapMine.mapFlag++;  
      mapMine.map[coord.x][coord.y] -= 2;
      target.innerHTML = null;
      if(target.localName == 'i')
        target.parentNode.innerHTML = null;
      numFlag.innerHTML = mapMine.mapFlag;
    }
  }

  // 判断结果
  judgeMine();
}


// 取消右键菜单
document.oncontextmenu = function () { return false; };
// 获取坐标
function obtainCoord(target) {
  var i = 0;
  while ((target = target.previousElementSibling) != null) i++;
  return {
    x: Math.floor(i / mapMine.mapWidth) + 1,
    y: i % mapMine.mapWidth + 1
  }
}

// 重置游戏
btnGame.onmousedown = function(){
  initmapMine();
}

// 更改难度
simple.onmousedown = function(){
  normal.style.border = "2px solid #999";
  difficult.style.border = "2px solid #999";
  simple.style.border = "2px solid #333";
  degree = 'simple';
}
normal.onmousedown = function(){
  normal.style.border = "2px solid #333";
  difficult.style.border = "2px solid #999";
  simple.style.border = "2px solid #999";
  degree = 'normal';
}
difficult.onmousedown = function(){
  normal.style.border = "2px solid #999";
  difficult.style.border = "2px solid #333";
  simple.style.border = "2px solid #999";
  degree = 'difficult';
}

// 初始化游戏(开始游戏)
initmapMine();

document.onkeydown = function(e){
  if(e.keyCode == 71 && e.ctrlKey){
    for(var i = 1; i <= mapMine.mapHeight; i++){
      for(var j = 1; j <= mapMine.mapWidth; j++){
        if(mapMine.map[i][j] == 1 || mapMine.map[i][j] == 3){
          var currDiv = div[(i-1)*mapMine.mapWidth+j-1];
          currDiv.style.borderColor = 'red';
        }
      }
    }
  }
}
document.onkeyup = function(e){
  if(e.keyCode == 71 && e.ctrlKey){
    for(var i = 1; i <= mapMine.mapHeight; i++){
      for(var j = 1; j <= mapMine.mapWidth; j++){
        if(mapMine.map[i][j] == 1 || mapMine.map[i][j] == 3){
          var currDiv = div[(i-1)*mapMine.mapWidth+j-1];
          currDiv.style.borderColor = '#999';
        }
      }
    }
  }
}